<template>
    <div class="build-highlight">
        <el-select v-model="value" placeholder="Select" style="width: 240px"
            @change="myProjectManager.buildingCollection.setFloorHighLight(value)">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
        <el-button @click="myProjectManager.buildingCollection.setAllFloorsHighlight('综合楼')">全部高亮</el-button>
        <el-button @click="myProjectManager.buildingCollection.setAllFloorsHighlight('综合楼', false)">取消全部高亮</el-button>
        <el-button
            @click="myProjectManager.buildingCollection.setFloorHighLight('floor_zonghelou_3', 'Warning')">报警3层</el-button>
        <el-button
            @click="myProjectManager.buildingCollection.setFloorHighLight('floor_zonghelou_3', 'none')">取消报警</el-button>
    </div>
</template>

<script setup lang="ts">
import { onMounted, ref } from "vue";
import { getMyProjectManager } from "@/getMyProjectManager";
const myProjectManager = getMyProjectManager()
const value = ref('')
const options = [
    {
        label: '取消高亮',
        value: '',
    }, {
        label: '高亮-综合楼1层',
        value: 'floor_zonghelou_1',
    }, {
        label: '高亮-综合楼2层',
        value: 'floor_zonghelou_2',
    }, {
        label: '高亮-综合楼3层',
        value: 'floor_zonghelou_3',
    }, {
        label: '高亮-综合楼3层',
        value: 'floor_zonghelou_4',
    }, {
        label: '高亮-综合楼5层',
        value: 'floor_zonghelou_5',
    }, {
        label: '高亮-综合楼6层',
        value: 'floor_zonghelou_6',
    }, {
        label: '高亮-综合楼顶层',
        value: 'floor_zonghelou_7',
    }, {
        label: '高亮-餐厅1层',
        value: 'floor_canting_1',
    }, {
        label: '高亮-餐厅2层',
        value: 'floor_canting_2',
    }, {
        label: '高亮-餐厅3层',
        value: 'floor_canting_3',
    }
]


</script>
<style scoped>
button {
    margin-left: 10px;
}
</style>